<template>
  <div class="echart" id="myChartPie" :style="{float:'left',width: '100%', height: '230px'}"></div>
</template>

<script>
  import api from "../../../../axios/api"
    export default {
      name: "studentScoreByPie",
      // mounted(){
      //     this.drawLine();
      // },
      data(){
        return {
          option: {
            legend: {
              top: 'bottom'
            },
            toolbox: {
              show: true,
              feature: {
                mark: {show: true},
                dataView: {show: true, readOnly: false},
                restore: {show: true},
                saveAsImage: {show: true}
              }
            },
            series: [
              {
                name: '面积模式',
                type: 'pie',
                radius: [10, 80],//内外径大小
                center: ['50%', '50%'],
                roseType: 'area',
                itemStyle: {
                  borderRadius: 8
                },
                data: [
                  {value: 40, name: 'rose 1'},
                  {value: 38, name: 'rose 2'},
                  {value: 32, name: 'rose 3'},
                  {value: 30, name: 'rose 4'},
                  {value: 28, name: 'rose 5'},
                  {value: 26, name: 'rose 6'},
                  {value: 22, name: 'rose 7'},
                  {value: 18, name: 'rose 8'}
                ]
              }
            ]
          }
        }
      },
      methods: {
        drawLine(){
          let myChart = this.$echarts.init(document.getElementById('myChartPie'))
          // 绘制图表
          myChart.setOption(this.option);
        },

        //根据id查询学生信息
        getScoreBySno:function(){
          let _this = this;
          api.setDataFromAxios("/api/TestWeb/studentController/getScoreBySno/09010101",null,"post",null).then(
            dto=>{
              let scs = dto.tList;
              let data = [];
              let legendData = [];
              for (var i=0;i<scs.length;i++){
                let sc = scs[i];
                data.push({value:sc.score,name:sc.course.cname});
                legendData.push(sc.course.cname);
              }
              this.option.series[0].data = data;
              this.option.legendData = legendData;

               this.drawLine();
            }
          )
        },
      },
      created() {
        this.getScoreBySno();
      }

    }
</script>

<style scoped>

</style>
